<div class="main" role="main">

    <!-- Page Heading -->
    <section class="page-heading">
        <div class="container">
            <div class="row">
                <div class="col-md-6">
                    <h1>Profilo Pet Owner <?= $user['Nome'] ?> <?= $user['Cognome'] ?></h1>
                </div>
                <div class="col-md-6">
                    <ul class="breadcrumb">
                        <li><a href="<?=base_url()?>">Home</a></li>
                        <li><a href="#">Pet Owner</a></li>
                        <li class="active">Profilo</li>
                    </ul>
                </div>
            </div>
        </div>
    </section>
    <!-- Page Heading / End -->

    <!-- Page Content -->
    <section class="page-content">
        <div class="container">

            <div class="row">
                <div class="content col-md-12">

                    <div class="job-profile-info" itemscope itemtype="http://schema.org/Person">
                        <div class="row">
                            <div class="col-md-5">
                                <figure class="alignnone">
                                    <img itemprop="image" src="<?= base_url() ?><?= $user['path_profile'] ?>" alt="Foto <?= $user['Nome'] ?>, <?= $user['Cognome'] ?>">
                                </figure>
                            </div>
                            <div class="col-md-7">
                                <h2 class="name"><span itemprop="givenName"><?= $user['Nome'] ?></span>
                                    <span itemprop="familyName"><?= $user['Cognome'] ?></span>
                                </h2>
                                <ul class="meta">
                                    <li><strong itemprop="award">Pet Owner</strong></li>
                                </ul>
                                <ul class="info">
                                    <li id="city">
                                        <i class="fa fa-map-marker"></i>
                                        <span itemprop="address"> <a id="address" href="#"><?= $user['Indirizzo'] ?></a>, <?= $user['Citta'] ?> </span>
                                    </li>

                                </ul>

                                <div class="spacer-lg"></div>

                                <a href="#" class="btn btn-success btn-lg"><span class="fa fa-envelope"></span> Send Message</a>
                            </div>
                        </div>

                        <div class="spacer-lg"></div>

                        <h4><i class="fa fa-paw"></i>I Miei Amici a quattro zampe <i class="fa fa-paw"></i></h4>
                        <div class="prev-next-holder text-right">
                            <a class="prev-btn" id="carousel-prev"><i class="fa fa-angle-left"></i></a>
                            <a class="next-btn" id="carousel-next"><i class="fa fa-angle-right"></i></a>
                        </div>

                        <div class="owl-carousel-wrapper row">
                            <div id="owl-carousel" class="owl-carousel">
<?php foreach ($animali as $item): ?>
                                <div class="project-item">
                                    
                                    <div class="project-item-inner" itemprop="follows" itemscope="" itemtype="http://schema.org/Person" >
                                        <figure class="alignnone project-img">
                                            <img itemprop="image" src="<?=base_url()?><?=$item['pet_foto_path']?>" alt="Pet <?=$item['NomePet']?>" />
                                            <div class="overlay">
                                                <a href="<?=site_url('profilo/pet/' . $id ."/" . $item['IDPET'])?>" class="dlink"><i class="fa fa-link"></i></a>
                                                <a href="<?=base_url()?><?=$item['pet_foto_path']?>" class="popup-link zoom"><i class="fa fa-search-plus"></i></a>
                                            </div>
                                        </figure>
                                        <div class="project-desc">
                                            <h4 class="title" itemprop="name"><a href="#"><?=$item['NomePet']?></a></h4>
                                            <span class="desc"><?=$item['Razza']?>/<?=$item['Taglia']?></span>
                                        </div>
                                    </div>
                                    
                                </div>
                                <?php endforeach; ?>
                            </div>
                        </div>

                        <hr class="lg">

                        <h4>Location</h4>
                        <!-- Google Map -->
                        <div class="googlemap-wrapper">
                            <div id="map_canvas" class="map-canvas"></div>
                        </div>
                        <!-- Google Map / End -->

                        <hr class="lg">


                    </div>


                </div>

            </div>
        </div>
    </section>
    <!-- Page Content / End -->

<script type="text/javascript">
        function initialize() {
            var myLatlng = new google.maps.LatLng(<?= $user['lat'] ?>,<?= $user['long'] ?>);
            var mapOptions = {
                zoom: 14,
                center: myLatlng
            }
            var map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);

            var marker = new google.maps.Marker({
                position: myLatlng,
                map: map,
                title: '<?= $user['Nome'] ?>'
            });
        }
        google.maps.event.addDomListener(window, 'load', initialize);
        $().ready(function(){
            initialize();
        });
    </script>